<div class="da-list-wrap">
  <div class="da-content-banner">
    <d-breadcrumb>
      <d-breadcrumb-item><a routerLink="/">{{ 'basicdata.breadcrumb.home' | translate }}</a></d-breadcrumb-item>
      <d-breadcrumb-item>{{ 'basicdata.breadcrumb.employs' | translate }}</d-breadcrumb-item>
    </d-breadcrumb>
  </div>
  <div class="da-content-wrapper">
    <div class="departments">
      <div class="card">
        <div class="card-title">
          <span>部门列表</span>
        </div>
        <div class="fitter mt-3">
          <input dTextInput placeholder="请输入" name="searchDepartmentValue" (input)="searchDepartment($event)" />
        </div>
        <div class="card-body ">
          <d-tree #basicTree [tree]="displayTreeData" [treeNodeIdKey]="'id'" [treeNodeTitleKey]="'name'"
            [treeNodeChildrenKey]="'subDepartments'" (afterTreeInit)="afterTreeInit($event)"
            (nodeSelected)="nodeSelected($event)">
          </d-tree>
        </div>
        <div class="card-footer d-flex  align-items-bottom justify-content-center">
          <div class="dDropDown" dDropDown appendToBody [trigger]="'click'" [appendToBodyDirections]="['centerUp']">
            <d-button-group>
              <d-button bsStyle="common" class="" bsSize="sm" (btnClick)="CreatDepartment()">
                新增
              </d-button>
              <d-button class="more" icon="icon-select-arrow" bsSize="sm" dDropDownToggle bsStyle="common"></d-button>
            </d-button-group>
            <ul dDropDownMenu class="devui-dropdown-menu devui-scrollbar" role="menu">
              <li role="menuitem">
                <a dDropDownMenuItem (click)="EditDepartment()" [ngClass]="{'disabled':!this.departmentId}">编辑</a>
              </li>
              <li role="menuitem">
                <a dDropDownMenuItem (click)="DeleteDepartment()" [ngClass]="{'disabled':!this.departmentId}">删除</a>
              </li>
            </ul>
          </div>
          <div class="dDropDown" dDropDown appendToBody [trigger]="'click'" [appendToBodyDirections]="['centerUp']">
            <input type="file" #fileInput2 style="display: none" (change)="ImportDepartmentsFromExcel($event)">
            <d-button-group>
              <d-button bsStyle="common" class="" bsSize="sm" (btnClick)="onButtonClick2()">
                导入
              </d-button>
              <d-button class="more" icon="icon-select-arrow" bsSize="sm" dDropDownToggle bsStyle="common"></d-button>
            </d-button-group>
            <ul dDropDownMenu class="devui-dropdown-menu devui-scrollbar" role="menu">
              <li role="menuitem" (click)="DownloadDepartmentFileModel()">
                <a dDropDownMenuItem>下载模板</a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div class="employs-box">
      <div class="card">
        <div class="card-header">
          <div>
            <div class="d-input">
              <input dTextInput style="width: 180px;" [error]="false" placeholder="编码/名称/工号" [(ngModel)]="SearchTerm"
                name="SearchTerm">
              <d-select class="ms-3" [options]="selectoptions" [(ngModel)]="selectvalue" (valueChange)="selctChange()"></d-select>
            </div>
            <d-button id="primaryBtn" style="margin-left: 8px" (click)="search()"><i
                class="icon icon-filter-o me-2"></i>查询</d-button>
            <d-button bsStyle="common" (btnClick)=" reset()"> <i class="icon icon-refresh me-2"></i>重置</d-button>
          </div>
        </div>
        <div class="btn-group">
          <d-button bsStyle="primary" (btnClick)="addUser()"> <i class="icon icon-add me-2"></i>新增</d-button>
          <d-button bsStyle="success" (btnClick)="enableUsers()"><i class="icon icon-right me-2"></i>启用</d-button>
          <d-button bsStyle="warning" (btnClick)="disableUsers()"><i class="icon icon-error me-2"></i>禁用</d-button>
          <d-button bsStyle="danger" (btnClick)="deleteUsers()"><i class="icon icon-delete me-2"></i>删除</d-button>
          <div class="dDropDown" dDropDown [trigger]="'hover'" >
            <input type="file" #fileInput1 style="display: none" (change)="onFileSelected($event)">
            <d-button bsStyle="common" class="devui-dropdown-origin" (btnClick)="onButtonClick()">
              导入
              <span class="icon-select-arrow"></span>
            </d-button>
            <ul dDropDownMenu class="devui-dropdown-menu devui-scrollbar" role="menu">
              <li role="menuitem" (click)="DownloadUserFileModel()">
                <a dDropDownMenuItem>下载模板</a>
              </li>
            </ul>
          </div>
          <d-button bsStyle="common" (btnClick)="DownloadUserFile()"> <i class="icon icon-merge me-2"></i>导出</d-button>
        </div>
        <div class="list-content">
          <d-data-table [lazy]="true" [dataSource]="displayTableData" [scrollable]="true" [fixHeader]="true"
            [resizeable]="true" [tableWidthConfig]="tableWidthConfig" (checkAllChange)="getCheckedRows()"
            (rowCheckChange)="getCheckedRows()" [tableOverflowType]="'auto'" [scrollable]="true" [resizeable]="true"
            [colDraggable]="true">
            <thead dTableHead [checkable]="true">
              <tr dTableRow>
                <th dHeadCell [fixedLeft]="'40px'">
                  操作
                </th>
                <th dHeadCell [fixedLeft]="colOption.fixedLeft " [fixedRight]="colOption.fixedRight"
                  *ngFor="let colOption of dataTableOptions.columns">{{ colOption.header }}</th>
              </tr>
            </thead>
            <tbody dTableBody>
              <ng-template let-rowItem="rowItem" let-rowIndex="rowIndex" let-nestedIndex="nestedIndex">
                <tr dTableRow>
                  <td dTableCell [fixedLeft]="'0px'">
                    <d-checkbox [disabled]="false" [showAnimation]="true" [showGlowStyle]="false"
                      [ngModelOptions]="{ standalone: true }" [ngModel]="rowItem.$checked" dTooltip
                      (ngModelChange)="onRowCheckChange($event, rowIndex, nestedIndex, rowItem)" [disabled]="rowItem.name =='超级管理员'"></d-checkbox>
                  </td>
                  <td dTableCell [fixedLeft]="'40px'">
                    <span class="me-2" ><a [class.disabled]="rowItem.name =='超级管理员'" class="devui-link"(click)="edit(rowItem)">编辑</a></span>
                    <span class="me-2" ><a [class.disabled]="rowItem.name =='超级管理员'" class="devui-link"(click)="ResetPassword(rowItem)">改密码</a></span>
                    
                  </td>
                  <td dTableCell [rowItem]="rowItem" [fixedLeft]="'200px'">
                    <span dTooltip [content]="rowItem?.employeeCode">{{rowItem?.employeeCode}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem" [fixedLeft]="'300px'">
                    <span dTooltip [content]="rowItem?.name">{{rowItem?.name}}</span>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.jobNumber">{{rowItem?.jobNumber}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.accountNumber">{{rowItem?.accountNumber}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.departmentName">{{rowItem?.departmentName}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.isManager | isEmpowerment">
                      <d-tag [tag]=" rowItem?.isManager | isEmpowerment"
                        [labelStyle]="rowItem?.isManager"></d-tag></span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.position">{{rowItem?.position}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.gender | gender">{{rowItem?.gender | gender}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.ownerPhoneNumber">{{rowItem?.ownerPhoneNumber}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.bankName">{{rowItem?.bankName}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.accountHolder">{{rowItem?.accountHolder}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.bankAccountNumber">{{rowItem?.bankAccountNumber}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.contractStartDate">{{rowItem?.contractStartDate}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.identityCardNumber">{{rowItem?.identityCardNumber}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.ownerEmail">{{rowItem?.ownerEmail}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.address">{{rowItem?.address}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.isInsured |isInsured">{{rowItem?.isInsured |isInsured}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.employeeType | userType">{{rowItem?.employeeType | userType
                      }}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.salaryCategory">{{rowItem?.salaryCategory}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.contractStartDate">{{rowItem?.contractStartDate}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.contractEndDate">{{rowItem?.contractEndDate}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem">
                    <span dTooltip [content]="rowItem?.resignationDate">{{rowItem?.resignationDate}}</span>
                  </td>
                  <td dTableCell [rowItem]="rowItem" [fixedRight]="'0px'">
                    <span dTooltip [content]="rowItem?.enabled | status"><d-tag [tag]=" rowItem?.enabled | status" [labelStyle]="rowItem?.enabled"></d-tag></span>
                  </td>
                </tr>
              </ng-template>
            </tbody>
          </d-data-table>
        </div>
        <div class="page-footer">
          <div>
            <p>已选 <span class="underline">{{deleteIDs.length}}</span> 条
              <a (click)="cleared()" class="clear">清空</a>
            </p>
          </div>
          <d-pagination [size]="'sm'" [canViewTotal]="true" [canChangePageSize]="true" [canJumpPage]="true"
            [maxItems]="5" [total]="this.pager.total" [pageSizeOptions]="this.pageSizeOptions"
            [(pageSize)]="pager.pageSize" [(pageIndex)]="pager.pageIndex" (pageIndexChange)="pageIndexChange($event)"
            (pageSizeChange)="pageSizeChange($event)">
          </d-pagination>
        </div>

      </div>
    </div>

  </div>
</div>
<d-toast [value]="msgs" [life]="2000" [styleClass]="'custom-class'" [style]="{ left: '50%',top:'10px' }"></d-toast>
